{% extends "base.html" %}

{% block main_content %}
    {% include 'message.html' %}
    <div class="tab-content vertical-tab-content">


        <div class="panel panel-default">
            <div class="panel-heading">
                <span style="font-weight: bold">角色列表</span>
                <a data-toggle="modal" data-target="#roel_model">
                    <i class="glyphicon glyphicon-plus" title="添加"></i>
                </a>
                <a style="float:right;" href="/index/">
                    <i class="glyphicon glyphicon-th" title="首页"></i>
                </a>
            </div>
            <div class="panel-body">
                <div class="modal fade" id="roel_model" tabindex="-1" role="dialog"
                     aria-labelledby="myModalLabel" aria-hidden="true">
                    <div class="modal-dialog">
                        <div class="modal-content">
                            <form action="/create_role/" method="POST">
                                <div class="modal-header">
                                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                                        &times;
                                    </button>
                                    <h4 class="modal-title">创建角色</h4>
                                </div>
                                <div class="modal-body">
                                    <input class="form-control" name="name">
                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭
                                    </button>
                                    <button type="submit" class="btn btn-primary">提交</button>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>

                {% if roles %}

                    <table class="table table-bordered">
                        <thead>
                        <tr>
                            <th>ID</th>
                            <th>角色名称</th>
                            <th>启用状态</th>
                            <th>创建日期</th>
                            <th></th>
                        </tr>
                        </thead>
                        <tbody>
                        {% for item in roles %}
                            <tr>
                                <td>

                                        <a href="/role_map/{{ item.rid }}">{{ item.rid }}</a>

                                    </td>
                                <td>{{ item.name }}</td>
                                <td>
                                    {% if item.enabled %}
                                        <a href="/update_role/enabled/{{ item.rid }}">
                                                    <span class="glyphicon glyphicon-ok-circle"
                                                          style="color: blue;font-size: 20px"></span> </a>
                                    {% else %}
                                        <a href="/update_role/enabled/{{ item.rid }}">
                                                    <span class="glyphicon glyphicon-ban-circle"
                                                          style="color: #ff0000;font-size: 20px"></span> </a>
                                    {% endif %}
                                </td>
                                <td>{{ item.create_date }}</td>
                                <td>
                                    {% if item.rid != 0 %}
                                        <a href="/delete_role/{{ item.rid }}"><span
                                                class="glyphicon glyphicon-trash" style="color: red" ></span></a>
                                    {% endif %}
                                </td>
                            </tr>
                        {% endfor %}
                        </tbody>
                    </table>

                {% else %}
                    <div class="jumbotron">
                        <h3>没有数据</h3>
                        <p>&nbsp;</p>
                        <p><a class="btn btn-primary btn" href="/create_user/" role="button">去添加</a></p>
                    </div>
                {% endif %}

            </div>
        </div>

    </div>
{% endblock %}